@include('header')
<style>
    #swiperPartner {
        width: 100%;
        height: 100%;
        padding:20px 40px;}
    #swiperPartner .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;}
    #swiperPartner .swiper-button-next, #swiperPartner .swiper-button-prev { position: absolute;top: 0; width: 40px; height: 100%;z-index: 2; margin-top: 0; cursor: pointer;
        background-size: 27px 44px;
        background-position: center;
        background-repeat: no-repeat;
        background-color: #f9f9f9;
        background-image:none;
        display:flex;
        align-items:center;
    }
    #swiperPartner .swiper-button-next img, #swiperPartner .swiper-button-prev img{opacity:0.4;}
    #swiperPartner .swiper-button-next:hover img, #swiperPartner .swiper-button-prev:hover img{opacity:1;}
    #swiperPartner .swiper-button-prev { left: 0;justify-content:flex-start;}
    #swiperPartner .swiper-button-next { right: 0;justify-content:flex-end;}

</style>
@include('template.banner')
<div class="container">
    <div class="sub-nav-box">
        <div class="tit">
            关于我们 / <span>About us</span>
        </div>
        <div class="en-tit">因为专业所以信赖</div>
    </div>
    <div class="sub-nav visible-md hidden-sm hidden-xs" id="subNav">
        <div class="row forus">
            <div class="forusbox">
                <div class="col-md-6 for1 font-size-16">
                    {!! $about_1['value'] !!}
                </div>
                <div class="col-md-6 for2">
                    <img src="{{asset("/images/about_company.png")}}" />
                    <div class="forus-number">
                        <ul>
                            <li class="col-md-3 col-sm-3 col-xs-3">
                                <div class="num">20+</div>
                                <p>事务所历史</p>
                            </li>
                            <li class="col-md-3 col-sm-3 col-xs-3">
                                <div class="num">200+</div>
                                <p>事务所团队</p>
                            </li>
                            <li class="col-md-3 col-sm-3 col-xs-3">
                                <div class="num">100+</div>
                                <p>事务所办事处</p>
                            </li>
                            <li class="col-md-3 col-sm-3 col-xs-3">
                                <div class="num">1000+</div>
                                <p>处理事件（万）</p>
                            </li>
                        </ul>
                    </div>

                </div>
                <div class="col-md-6 for3">
                    <img src="{{asset("/images/about_company_2.png")}}" />
                </div>
                <div class="col-md-6 for4 font-size-16">
                    {!! $about_2['value'] !!}
                    </div>
            </div>
        </div>
    </div>
</div>
<!--荣誉资质-->
@if(!empty($honours))
<div class="honor-bg">
    <div class="container">
        <div class="sub-nav-box">
            <div class="tit">
                荣誉资质 / <span>Honorary certificate</span>
            </div>
            <div class="en-tit">因为专业所以信赖</div>
        </div>
            <div class="padding-bottom-10">
                <!-- Swiper -->
                <div class="container">
                    <div class="swiper-container" id="swiperPartner">
                        <div class="swiper-wrapper imgae-same-size">
                            @foreach($honours as $honour)
                                <div class="swiper-slide">
                                    <div class="display-block">
                                        <img src="{{asset($honour)}}" style="height: 150px; width: 250px" />
                                    </div>
                                </div>

                            @endforeach
                        </div>
                        <div class="swiper-button-next"><img src="{{asset('images/sprite-r.png')}}" alt="Alternate Text" /></div>
                        <div class="swiper-button-prev"><img src="{{asset('images/sprite-l.png')}}" alt="Alternate Text" /></div>
                    </div>
                </div>
            </div>
    </div>
</div>
@endif
<script>
    var swiper = new Swiper('.swiper-container', {
        slidesPerView: 4,
        spaceBetween: 30,
        slidesPerGroup: 1,
        autoplay:true,
        loopFillGroupWithBlank: true,
        pagination: {
            el: '.swiper-pagination',
            clickable: true,
        },
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
        breakpoints: {
            768: {
                slidesPerView: 3,
            },
            468: {
                slidesPerView: 1,
            }
        }
    });

</script>
@include('bottom')
